<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
        PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">
<ui:composition template="../templates/layout.xhtml">
    <ui:define name="title">Reporte Resumen de Agrupaciones por Años</ui:define>
    <ui:define name="content">
        <p:spacer height="5px"/>
        <p:panel>
            <h:outputText value="Reporte Resumen de Agrupaciones por Años"  styleClass="text_header_page"/>
        </p:panel>
        <p:spacer height="5px"/>
        <h:form id="frmPrincipal">
            <!-- Panel de búsqueda-->
            <p:panel id="panelBusqueda" toggleable="true">
                <h:panelGrid id="gridBusqueda" columns="6">
                    <p:spacer width="13px"/>
                    <h:outputLabel for="cmbGrupoEmpresarial" value="Grupo Empresarial"/>
                    <p:selectOneMenu id="cmbGrupoEmpresarial"
                                     style="width:180px;">
                        <f:selectItem itemLabel="Seleccione" itemValue="" noSelectionOption="true"/>
                    </p:selectOneMenu>

                    <p:spacer width="13px"/>
                    <h:outputLabel for="cmbSociedad" value="Sociedad"/>
                    <p:selectOneMenu id="cmbSociedad"
                                     style="width:180px;">
                        <f:selectItem itemLabel="Seleccione" itemValue="" noSelectionOption="true"/>
                    </p:selectOneMenu>

                    <p:spacer width="13px"/>
                    <h:outputLabel  value="Módulo"/>
                    <p:selectOneMenu  effect="fade">
                        <f:selectItem itemLabel="Seleccione" itemValue="" noSelectionOption="true"/>
                    </p:selectOneMenu>
                    <p:spacer width="13px"/>
                    <h:outputLabel  value="Agrupación"/>
                    <p:selectOneMenu  effect="fade">
                        <f:selectItem itemValue="" itemLabel="Todos"/>
                    </p:selectOneMenu>

                </h:panelGrid>
                <p:spacer height="3px"/>

                <p:spacer height="3px"/>
                <h:panelGrid id="gridBusqueda3" columns="3">
                    <p:commandButton ajax="true" value="Buscar" id="btnBuscar" icon="ui-icon-search"      />
                    <p:commandButton ajax="true" value="Limpiar" id="btnLimpiar" icon="ui-icon-refresh"  />
                </h:panelGrid>
            </p:panel>

            <p:spacer height="10px"/>

            <!-- Panel de resultados (donde está la tabla)  -->
            <p:panel id="panelResultados" header="Resultados">
                <p:dataTable id="tablaRegistros"
                             var="registro" paginator="true" rows="25"
                             paginatorPosition="bottom" emptyMessage="No existen registros"
                             selectionMode="single"
                             paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
                             rowsPerPageTemplate="5,10,25,50">
                    <p:ajax event="rowSelect"
                            update=":frmPrincipal:panelDetalle"/>
                    <p:columnGroup type="header">
                        <p:row>
                            <p:column headerText="Módulo(1)"/>
                            <p:column headerText="Agrupación(2)"/>
                            <p:column headerText="hasta año1"/>
                            <p:column headerText="año2"/>
                            <p:column headerText="año3"/>
                            <p:column headerText="año4"/>
                            <p:column headerText="Total"/>
                        </p:row>
                    </p:columnGroup>

                    <p:column style="text-align: center">
                        <h:outputText value=""/>
                    </p:column>

                    <p:column style="text-align: center">
                        <h:outputText value=""/>
                    </p:column>
                    <p:column style="text-align: center">
                        <h:outputText value="">
                            <f:convertNumber pattern="###,###,##0.00" locale="en-US"/>
                        </h:outputText>
                    </p:column>
                    <p:column style="text-align: center">
                        <h:outputText value="">
                            <f:convertNumber pattern="###,###,##0.00" locale="en-US"/>
                        </h:outputText>
                    </p:column>
                    <p:column style="text-align: center">
                        <h:outputText value="">
                            <f:convertNumber pattern="###,###,##0.00" locale="en-US"/>
                        </h:outputText>
                    </p:column>
                    <p:column style="text-align: center">
                        <h:outputText value="">
                            <f:convertNumber pattern="###,###,##0.00" locale="en-US"/>
                        </h:outputText>
                    </p:column>
                    <p:column style="text-align: center">
                        <h:outputText value="">
                            <f:convertNumber pattern="###,###,##0.00" locale="en-US"/>
                        </h:outputText>
                    </p:column>
                </p:dataTable>
            </p:panel>
        </h:form>
    </ui:define>
</ui:composition>
</html>